.theme-light {

    .contain-weather .text-weather {
        color: #565656;
    }

    /* ---------------------- 主题 ---------------------- */
    .ant-switch {
        background-color: #DEE0E2;
    }

    .ant-switch-loading-icon,
    .ant-switch:after {
        background: #FFFFFF;
    }   
    
    .ant-dropdown-menu-item:hover {
        background: #f1f1f1;
    }

    /* ---------------------- 抽屉 ---------------------- */
    .ant-drawer-content {
        // background: rgba(255, 255, 255, 1);
        background-image:linear-gradient(45deg,#bcdbd7,rgb(255, 255, 255));
        box-shadow: 0px 0px 10px 0px rgba(107, 107, 107, 0.1);
    }

    /* ---------------------- 菜单项 ---------------------*/
    .menu-item {
        background: #FFF;
        font-size : 15px;
        color     : rgba(44, 44, 44, 1);
    }

    .menu-item-select,
    .menu-item:hover {
        background: rgba(222, 222, 222, 1);
    }

    .menu-sub-item {
        background: rgba(244, 244, 244, 1);
        font-size : 14px;
        color     : rgba(93, 93, 93, 1);
    }

    .menu-sub-item-select,
    .menu-sub-item:hover {
        background: rgba(222, 222, 222, 1);
    }


    /* ---------------------- 背景 ---------------------- */
    @app-color: #F7F7F7;

    /* ---------------------- 头部 -------------------------------- */
    @head-color     : #FFFFFF;
    @head-text-color: #232323;
    @head-menu-color: #FAFAFA;
    @head-menu-icon : url("");
    @head-name-color: #222222;
    @head-down      : url("");
    @head-bell      : url("");

    #header {
        box-shadow: 0px 0px 10px 0px rgba(51, 51, 51, 0.1);
    }

    /* ---------------------- 面板 -------------------------------- */
    @panel-color          : #FFFFFF;
    @panel-border         : 0px 0px 10px 0px rgba(85, 85, 85, 0.1);
    @panel-title-color    : #262626;
    @panel-span-text-color: #989898;

    #panel {
        border    : 2px solid rgba(130, 110, 255, 0);
        box-shadow: 0px 0px 10px 0px rgba(85, 85, 85, 0.1);
    }

    #panel-divide-0 {
        background: #ececec;
    }



    @panel-inpanel                : #F7F7F7;
    @panel-inpanel-span-color     : #262626;
    @panel-inpanel-span-hint-color: #262626;


    /* ---------------------- 选中 -------------------------------- */
    @view-select-color-0       : #5086FF;
    @view-select-text-color-0  : rgba(255, 255, 255, 1);
    @view-unselect-color-0     : rgba(239, 239, 239, 1);
    @view-unselect-text-color-0: rgba(38, 38, 38, 1);

    /* ---------------------- 统计表单 ---------------------------- */
    @table-statistics-color         : #F8F8F8;
    @table-staticstics-th-text-color: rgba(44, 44, 44, 1);
    @table-staticstics-td-color     : #FFFFFF;
    @table-staticstics-td-text-color: #636363;
    @table-staticstics-divide       : #EBEBEB;


    /* ---------------------- 方块色 ---------------------------- */
    #color-line-0 {
        background: #ff6060;
    }

    #color-line-1 {
        background: #5086ff;
    }


    /* -------------------------- 共有 --------------------------*/
    .theme(@app-color,
        @head-menu-icon, @head-color, @head-text-color, @head-menu-color, @head-name-color, @head-down, @head-bell,
        @view-select-color-0, @view-select-text-color-0, @view-unselect-color-0, @view-unselect-text-color-0,
        @table-statistics-color, @table-staticstics-th-text-color, @table-staticstics-td-color, @table-staticstics-td-text-color, @table-staticstics-divide,
        @panel-color, @panel-border, @panel-title-color, @panel-span-text-color,
        @panel-inpanel, @panel-inpanel-span-color, @panel-inpanel-span-hint-color )
}

.theme-dark {
    .contain-weather .text-weather {
        color: #FFFFFF;
    }

    /* ---------------------- 主题 ---------------------- */
    .ant-switch-checked {
        background-color: #6351FB;
    }

    .ant-switch-loading-icon,
    .ant-switch:after {
        background: #B0A7FF;
    }

    .ant-dropdown-menu {
        background: #8c7cff;
        box-shadow: 0px 0px 10px 0px rgba(107, 107, 107, 0.1);
    }

    .ant-dropdown-menu-item,
    .ant-dropdown-menu-submenu-title {
        color: #FFF;
    }

    .ant-dropdown-menu-item:hover {
        background: #705df5;
    }

    /* ---------------------- 抽屉 ---------------------- */
    .ant-drawer-content {
        background: rgba(78, 60, 197, 1);
        box-shadow: 0px 0px 10px 0px rgba(107, 107, 107, 0.1);
    }

    /* ---------------------- 菜单项 ---------------------*/
    // 一级菜单默认颜色
    .menu-item {
        background: transparent;
        font-size : 15px;
        color     : #FFF;
    }

    // 一级菜单选中颜色
    .menu-item-select,
    .menu-item:hover {
        background: rgba(101, 83, 234, 1);
    }

    // 二级菜单默认颜色
    .menu-sub-item {
        background: rgba(62, 47, 172, 1);
        font-size : 14px;
        color     : #FFFFFF;
    }

    // 二级菜单选中颜色
    .menu-sub-item-select,
    .menu-sub-item:hover {
        background: rgba(101, 83, 234, 1);
    }


    /* ---------------------- 背景 ---------------------- */
    @app-color : rgba(37, 10, 115, 1);

    /* ---------------------- 头部 ---------------------- */
    @head-color     : linear-gradient(180deg, rgba(56, 35, 152, 1), rgba(56, 35, 152, 1), rgba(102, 88, 228, 1));
    @head-text-color: #FFFFFF;
    @head-menu-color: #4D37C5;
    @head-menu-icon : url("");
    @head-name-color: #FFFFFF;
    @head-down      : url("");
    @head-bell      : url("");

    /* ---------------------- 面板 ---------------------- */
    @panel-color           : rgba(87, 73, 207, 0.9);
    @panel-border          : 2px solid rgba(130, 110, 255, 1);
    @panel-title-color     : #FFF;
    @panel-span-text-color : #D6D1FF;

    #panel {
        border    : 2px solid rgba(130, 110, 255, 1);
        box-shadow: 0px 0px 35px rgba(111, 96, 237, 1) inset;
    }

    #panel-divide-0 {
        background: #d6d1ff;
    }

    @panel-inpanel                : #6658DE;
    @panel-inpanel-span-color     : #FFFFFF;
    @panel-inpanel-span-hint-color: #BFB7FF;

    /* ---------------------- 选中 -------------------------------- */
    @view-select-color-0       : rgba(140, 124, 255, 1);
    @view-select-text-color-0  : rgba(255, 255, 255, 1);
    @view-unselect-color-0     : rgba(68, 52, 187, 1);
    @view-unselect-text-color-0: rgba(192, 195, 255, 1);

    /* ---------------------- 统计表单 ---------------------------- */
    @table-statistics-color         : #6658DE;
    @table-staticstics-th-text-color: rgba(233, 229, 255, 1);
    @table-staticstics-td-color     : #5749CF;
    @table-staticstics-td-text-color: rgba(233, 229, 255, 1);
    @table-staticstics-divide       : #6658DE;

    /* ---------------------- 方块色 ---------------------------- */
    #color-line-0 {
        background: #ff5252;
    }

    #color-line-1 {
        background: #3ecbff;
    }

    /* -------------------------- 共有 --------------------------*/
    .theme(@app-color,
        @head-menu-icon, @head-color, @head-text-color, @head-menu-color, @head-name-color, @head-down, @head-bell,
        @view-select-color-0, @view-select-text-color-0, @view-unselect-color-0, @view-unselect-text-color-0,
        @table-statistics-color, @table-staticstics-th-text-color, @table-staticstics-td-color, @table-staticstics-td-text-color, @table-staticstics-divide,
        @panel-color, @panel-border, @panel-title-color, @panel-span-text-color,
        @panel-inpanel, @panel-inpanel-span-color, @panel-inpanel-span-hint-color )
}

.theme(@app-color,
    @head-menu-icon, @head-color, @head-text-color, @head-menu-color, @head-name-color, @head-down, @head-bell,
    @view-select-color-0, @view-select-text-color-0, @view-unselect-color-0, @view-unselect-text-color-0,
    @table-statistics-color, @table-staticstics-th-text-color, @table-staticstics-td-color, @table-staticstics-td-text-color, @table-staticstics-divide,
    @panel-color, @panel-border, @panel-title-color, @panel-span-text-color,
    @panel-inpanel, @panel-inpanel-span-color, @panel-inpanel-span-hint-color ) {

    .ant-dropdown-menu {
        max-height: 200px;
        overflow-y: scroll;
    }

    .ant-dropdown-menu-item,
    .ant-dropdown-menu-submenu-title {
        min-width: 100px;
        height   : 40px;
        // flex
        display        : flex;
        align-items    : center;
        justify-content: center;
    }

    /* ---------------------- 背景 ---------------------- */
    background: @app-color;

    /* ---------------------- 头部 ---------------------- */
    #header {
        background: @head-color;
    }

    #header-title {
        color: @head-text-color;
    }

    #header-menu {
        background: @head-menu-color;
    }

    #header-menu-icon {
        background: @head-menu-icon;
    }

    #header-name {
        color: @head-name-color;
    }

    #header-down {
        background: @head-down;
    }

    #header-bell {
        background: @head-bell;
    }

    /* ---------------------- 面板 ---------------------- */
    #panel {
        background   : @panel-color;
        border-radius: 4px;
    }

    #panel-title {
        font-size: 16px;
        color    : @panel-title-color;
    }

    #panel-span-15 {
        font-size: 15px;
        color    : @panel-span-text-color;
    }

    #panel-span-14 {
        font-size: 14px;
        color    : @panel-span-text-color;
    }

    #panel-inpanel {
        background   : @panel-inpanel;
        border-radius: 7px;
    }

    #panel-inpanel-span {
        color      : @panel-inpanel-span-color;
        font-size  : 14px;
        line-height: 30px;
    }

    #panel-inpanel-span-hint {
        font-size: 14px;
        color    : @panel-inpanel-span-hint-color;
    }

    /* ---------------------- 统计表单 ------------------- */
    #table-statistics {
        height    : 290px;
        overflow-x: hidden;
        overflow-y: auto;
    }

    #table-statistics table {
        width : 100%;
        border: 1px solid @table-staticstics-divide;
    }

    #table-statistics tr {
        height: 60px;
    }

    #table-statistics th {
        text-align: center;
        background: @table-statistics-color;
        /* 文字 */
        font-size: 15px;
        color    : @table-staticstics-th-text-color;
    }

    #table-statistics td {
        position  : relative;
        text-align: center;
        background: @table-staticstics-td-color;
        /* text */
        font-size: 14px;
        color    : @table-staticstics-td-text-color;
    }

    #table-statistics td::after {
        position  : absolute;
        content   : "";
        top       : 0;
        left      : 0;
        right     : 0;
        height    : 1px;
        background: @table-staticstics-divide;
    }



    /* ---------------------- view select --------------- */
    #view-select-0 {
        padding-left : 25px;
        padding-right: 25px;
        height       : 40px;
        background   : @view-select-color-0;
        /* text */
        font-size  : 15px;
        color      : @view-select-text-color-0;
        text-align : center;
        line-height: 40px;
        cursor     : pointer;
    }

    #view-unselect-0 {
        padding-left : 25px;
        padding-right: 25px;
        height       : 40px;
        background   : @view-unselect-color-0;
        /* text */
        font-size  : 15px;
        color      : @view-unselect-text-color-0;
        text-align : center;
        line-height: 40px;
        cursor     : pointer;
    }

}